<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" >
    <title>LikingFit烟台鲁大店</title>
    <link rel="Shortcut Icon" href="/images/liking.png"/>
    <link rel="stylesheet" href="/m/bootstrap/bootstrap.css">
    <script src="/common/jquery-3.1.1.min.js"></script>
    <script src="/m/bootstrap/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/m/css/common.css">
    <link rel="stylesheet" href="/m/css/layout.css">
    <script src="/m/js/common.js"></script>
    <script src="/m/js/layout.js"></script>
    <style type="text/css">
        .container{
            padding-left: 0px;
            padding-right: 0px;
            padding-top: 0px;
        }
        .bg{
            background: url("/images/likingbg.png");
            height: 736px;
            background-repeat: no-repeat;

        }
        .title{
            color: white;
            height: 60px;
            line-height: 60px;
            text-align: center;
            margin-top: 0px !important;
        }
        .coupon-bg{
            background: url("/images/coupon-background.png");
            width: 280px;
            height: 125px;
            margin: 80px auto;
            background-size: 280px 125px;
            position: relative;
        }
        .price{
            /*margin: 0px auto;*/
            /*padding-top: 5px;*/
            text-align: center;
            color: white;
            float: right;
            height: 100%;
            line-height: 125px;
            padding-right: 10px;
        }
        .info{
            float: left;
            height: 100%;
            padding-left: 10px;
        }
        .number{
            font-size: 32px;
        }
        .sign{
            font-size: 20px;
            padding-right: 3px;
        }
        .no{
            font-size: 12px;
            font-weight: 300;
            color: #596167;
        }
        .name{
            /*position: absolute;*/
            /*bottom: 0;*/
            /*right: 10px;*/
            font-size: 16px;
            color: #227b56;
            margin-top: 24px;
            /*color: rgba(255, 255, 255, 0.7);*/
            /*text-align: center;*/
        }
        .desc{
            color: #596167;
            font-size: 13px;
            text-align: left;
            margin-top: 5px;
            height: 50px;
            max-width: 190px;
        }
        .other-info{
            /*text-align: center;*/
            color: white;
        }
        .other-info p{
            text-align: center;
        }
        .point{
            color: #34c86c;
        }


    </style>
    <script>
        // 常量
        var price = 100    //价格 100y元

        $(function () {
            //显示价格
            $('.price .number').text(price)
            var screenW = $(window).width()
            var screenH = Math.max(504,$(window).height())
            var bigImgW = 458
            var bigImgH = 736
            var bcoX = -(bigImgW - screenW)/2 + 'px'
            var bcoY = -(bigImgH - screenH)/2 + 'px'
            $('.bg').height(screenH)
            $('.bg').css({
                'background-position-x': bcoX,
                'background-position-y': bcoY,
            })
            var phone = getParams('phone')
            if (phone == null) {
                phone = ''
            }
            var params = {
                phone: phone
            }
            var pro = true
            var basicUrl = pro ? "http://afantizz.com" : "http://localhost:8000"
            $.post(basicUrl+"/likingfit/coupon", params, function (response, status) {
                if (status != 'success') {
                    showModel('操作失败,请稍后重试')
                    return
                }
                var resp = $.parseJSON(response);
                if (resp.err_code != 0) {
                    showModel(resp.err_msg,function () {

                    },1200)
                    return
                }
                var coupon = resp.data
                var no
                if (coupon.no < 10) {
                    no = '00'+coupon.no
                } else if (coupon.no < 100) {
                    no = '0'+coupon.no
                } else {
                    no = coupon.no
                }
                $('.no').text('编号:'+no)
                $('.number').text(coupon.price)
                $('.desc span').text('仅限'+coupon.name+'('+coupon.phone+')'+'使用')

            });
        })
    </script>
</head>
<body>
<div class="container">
    <div class="bg">
        <h4 class="title">我的优惠券</h4>
        <div class="coupon-bg">
            <div class="price">
                <span class="sign">¥</span><span class="number">100</span>
            </div>
            <!--<div class="desc">-->
                <!--<span>仅适用于likingfit烟台鲁大店</span>-->
            <!--</div>-->
            <div class="info">
                <div class="no"></div>
                <div class="name">
                    <span>LikingFit烟台鲁大店</span>
                </div>
                <div class="desc">
                    <span></span>
                </div>
            </div>
        </div>
        <div class="other-info">
            <p>购买会员卡时凭<span class="point">姓名</span>+<span class="point">手机号</span>兑换优惠券</p>
            <p>本活动最终解释权归LikingFit烟台鲁大店所有</p>
        </div>
    </div>
</div>
</body>
</html>